Media

【Flutter入門講座 第2回】Dartの基本文法を駆け足で。変数・null安全・クラス・非同期・レコードとパターン

【Flutter入門講座 第2回】Dartの基本文法を駆け足で。変数・null安全・クラス・非同期・レコードとパターン

第 1 回では、開発環境を作って最初のアプリを動かしました。第 2 回は、Flutter で使う言語 Dart の基本を押さえます。

Dart は、TypeScript に近い感覚で書ける、型のある言語です。JavaScript や TypeScript、Java などの経験があれば、すぐに読めるようになります。この記事では、講座で作るメモアプリに必要な文法に絞って紹介します。

この記事のコードは、Dart 3.11 で実行して結果を確認しています。dart run ファイル名.dart で、Flutter のアプリを起動せずに試せます。
TypeScript と Dart の書き方の比較

変数: var・final・const

dart
var count = 3;          // 型を推論(int)。あとから変更できる
final title = 'メモ';    // 1 回だけ代入できる(実行時に決まる値も OK)
const maxLength = 100;  // コンパイル時に決まる定数
count++;
print('$title は $count 件(最大 $maxLength 文字)');
// → メモ は 4 件(最大 100 文字)
  • 迷ったら `final` を使い、変える必要があるものだけ var にするのが Dart の書き方です
  • 文字列の中に $変数 や ${式} で値を埋め込めます(JavaScript のテンプレートリテラルに相当)
  • 文の終わりの ;(セミコロン)は省略できません

null 安全

Dart では、型に `?` を付けたものだけが `null` になれます。null の扱いを間違えるとコンパイル時に教えてくれるので、実行時のエラーを減らせます。

dart
String? subtitle;                       // null になれる
print(subtitle ?? '(サブタイトルなし)'); // null なら右側 → (サブタイトルなし)
print(subtitle?.length);                // null なら null のまま → null

String name = '大西';                    // null になれない
// name = null;                         // ← コンパイルエラー

書き方

意味

String?

null になれる文字列

a ?? b

a が null なら b

a?.b

a が null なら null、そうでなければ a.b

a!

「a は null ではない」と断言する(間違っていると実行時エラー。できるだけ使わない)

コレクション: List と Map

dart
final tags = <String>['仕事', '買い物'];
final counts = {'仕事': 2, '買い物': 1};       // Map<String, int>
final upper = [for (final tag in tags) '#$tag']; // コレクションの中で for が使える
print(upper);           // [#仕事, #買い物]
print(counts['仕事']);  // 2

リストの中に for や if を書ける(collection for / collection if)のは、Flutter で画面の部品を並べるときによく使います。

関数と名前付き引数

dart
String greet(String name, {bool polite = true}) =>
    polite ? '$name さん、こんにちは' : 'やあ、$name';

print(greet('大西'));                 // 大西 さん、こんにちは
print(greet('大西', polite: false));  // やあ、大西

{ } で囲んだ引数は名前付き引数です。呼び出すときに polite: false のように名前を書きます。Flutter のウィジェットは、ほとんどがこの名前付き引数で設定します(例: Text('こんにちは', style: ...))。

=> は、1 つの式を返すだけの関数の短い書き方です。

クラス

講座で作るメモアプリの、メモ 1 件を表すクラスです。

lib/memo.dart(抜粋)dart
class Memo {
  const Memo({required this.id, required this.text, this.done = false});

  final int id;
  final String text;
  final bool done;

  // 一部だけ変えた新しい Memo を作る
  Memo copyWith({String? text, bool? done}) =>
      Memo(id: id, text: text ?? this.text, done: done ?? this.done);
}
使い方dart
final memo = Memo(id: 1, text: '牛乳を買う');
final done = memo.copyWith(done: true);
print(done.done); // true
  • required は「必ず指定する名前付き引数」、this.done = false は既定値です
  • フィールドを final にして、変えるときは copyWith で新しいオブジェクトを作る書き方は、Flutter で状態を扱うときの定番です(第 4 回)

非同期処理: Future と async/await

通信やファイルの保存など、時間のかかる処理は `Future` で表します。JavaScript の Promise とほぼ同じで、async/await も同じように使えます。

bin/async_sample.dartdart
Future<String> loadTitle() async {
  await Future.delayed(const Duration(milliseconds: 500)); // 通信や保存の代わり
  return 'メモ帳';
}

Future<void> main() async {
  print('読み込み開始');
  final title = await loadTitle();
  print('タイトル: $title');

  try {
    await failing();
  } catch (e) {
    print('エラー: $e');
  }
}

Future<void> failing() async => throw Exception('通信できませんでした');
実行結果text
読み込み開始
タイトル: メモ帳
エラー: Exception: 通信できませんでした

Dart 3 のレコードとパターン

Dart 3 からは、複数の値をまとめて返すレコードと、値の形で分岐・取り出しができるパターンが使えます。

dart
// レコード: (int, int) の 2 つの値を返す
(int, int) summarize(List<Memo> memos) =>
    (memos.length, memos.where((m) => m.done).length);

final (total, finished) = summarize([memo, done]); // 分割代入
print('全 $total 件・完了 $finished 件');           // 全 2 件・完了 1 件

// switch 式とパターン
String label(Memo memo) => switch (memo) {
      Memo(done: true) => '✓ ${memo.text}',
      Memo(text: final t) when t.isEmpty => '(空のメモ)',
      _ => '・${memo.text}',
    };
print(label(done)); // ✓ 牛乳を買う

switch 式は値を返すので、条件によって表示を変えたいときに if を重ねるより読みやすく書けます。

Dart で押さえておきたい 6 つのポイント

TypeScript との主な違い

TypeScript

Dart

型の扱い

実行時には型が消える

実行時にも型がある(is で確かめられる)

null

strictNullChecks で設定

常に null 安全

変数

let・const

var・final・const

文字列の埋め込み

テンプレートリテラル(バッククォート)

'$name'・'${式}'

非同期

Promise・async/await

Future・async/await

クラスの中の private

private キーワード

名前の先頭に _(ファイル単位で非公開)

まとめ

  • 変数は `final` を基本に、変えるものだけ var。定数は const
  • null 安全で、? を付けた型だけが null になれます。?? と ?. をよく使います
  • Flutter のウィジェットは名前付き引数で設定します
  • 時間のかかる処理は `Future` と async/await。JavaScript の Promise と同じ感覚です
  • Dart 3 のレコードとパターンで、複数の値や条件分岐をすっきり書けます

次回(第 3 回)は、いよいよ ウィジェットで画面を作ります。

Flutter 入門講座(全 6 回)

  1. Flutter とは?できることと開発環境の作り方
  2. Dart の基本文法(この記事・11月10日)
  3. ウィジェットで画面を作る(11月11日公開予定)
  4. 状態管理の第一歩(11月12日公開予定)
  5. API からデータを取得し、端末に保存する(11月13日公開予定)
  6. 画面遷移・テスト・リリースまで(11月14日公開予定)
Flutter・スマホアプリの開発を相談する

アプリの企画段階からのご相談も承ります。フォームは 24 時間受付です

※ Flutter・Dart は Google LLC の商標です。

参考

Contact

まずはお気軽にご相談ください。

WEB制作・システム開発・動画制作など、お問い合わせはこちらから承っております。

制作のご依頼・ご相談その他のお問い合わせ
メディア一覧へ戻る
お問い合わせ